/**
 * Created by Administrator on 2017/3/21.
 */
import React, {Component} from 'react';
import {Form, Input, Radio, Select, Switch, InputNumber, Upload, Icon} from 'antd';
import {connect} from 'dva';
import request from '@/utils/request';
const FormItem = Form.Item;
const Option = Select.Option;
@connect(({roles}) => ({
  roles
}))
class AddPoliciesForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showCustom: false,
      fileList: [],
      banks:[]
    };
  }

  componentDidMount() {
    const that=this;
    this.props.findChildFunc(this.getState);

  }

  getState = ()=> {
    return this.state.fileList
  }

  render() {
    const formItemLayoutWithLabel = {
      labelCol: {
        xs: {span: 24},
        sm: {span: 7},
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 15},
      }
    };
    const props = {
      onRemove: (file) => {
        this.setState(({fileList}) => {
          const index = fileList.indexOf(file);
          const newFileList = fileList.slice();
          newFileList.splice(index, 1);
          return {
            fileList: newFileList,
          };
        });
      },
      beforeUpload: (file) => {
        this.setState(({fileList}) => ({
          fileList: [file],
        }));
        return false;
      },
      listType: 'picture ',
      accept: 'image/*',
      fileList: this.state.fileList,
    };
    const {getFieldDecorator} = this.props.form;
    return (
      <div>
        <Form onSubmit={this.handleSubmit}>
       
          {
            !this.props.editRecord &&

            <FormItem
              {...formItemLayoutWithLabel}
              label='二维码'
            >
              <div className="dropbox">
                {getFieldDecorator('file', {
                  rules: [{required: true, message: '二维码图片不能为空'}],
                })(
                  <Upload.Dragger {...props}>
                    <p className="ant-upload-drag-icon">
                      <Icon type="inbox"/>
                    </p>
                    <p className="ant-upload-text">点击这个区域选择二维码</p>
                  </Upload.Dragger>
                )}
              </div>
            </FormItem>
          }
          <FormItem
            {...formItemLayoutWithLabel}
            label={(
              <span>
               可使用量
            </span>
            )}
          >
            {getFieldDecorator('allow_use_count', {
              initialValue: this.props.editRecord ? this.props.editRecord.allow_use_count : '',
              rules: [{required: true, message: '可使用量不能为空'}],
            })(
              <InputNumber style={{width: '100%'}}/>
            )}
          </FormItem>
          <Form.Item
            {...formItemLayoutWithLabel}
            label="状态">
            {getFieldDecorator('status', {
              initialValue: this.props.editRecord ? this.props.editRecord.status.toString() : '1',
              rules: [{required: true}],
            })(
              <Radio.Group>
                <Radio value="1">等待使用</Radio>
                <Radio value="2">正在使用</Radio>
                <Radio value="3">已停用</Radio>
              </Radio.Group>,
            )}
          </Form.Item>
          <FormItem
            {...formItemLayoutWithLabel}
            label={(
              <span>
               备注
            </span>
            )}
          >
            {getFieldDecorator('remark', {
              initialValue: this.props.editRecord ? this.props.editRecord.remark : '',
            })(
              <Input/>
            )}
          </FormItem>

        </Form>
      </div>
    );
  }
}

const AddPoliciesFormWrap = Form.create()(AddPoliciesForm);
export default connect()(AddPoliciesFormWrap);


